<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<div id="div1" style="width: 100px;height: 100px;background: red;position: absolute;top:0;left: 0;"></div>
</body>
<script type="text/javascript">
    function animate(ele,attr,value){
        var speed;
        var timer=null;
        (function(){
            clearInterval(timer);
            timer=setInterval(function(){
                var now=parseInt(ele.style[attr]);
                speed=(value-now)/10;
                speed=speed>0?Math.ceil(speed):Math.floor(speed);
                if(now!=value){
                    ele.style[attr]=now+speed+'px';
                }else{
                    clearInterval(timer);
                }
            },30);
        })();

    }
    var div = document.getElementById("div1");
    animate(div,'top',200);
    animate(div,'left',100);
</script>
</html>
